<template>
    <transition name="fade">
        <div class="newlist"
             style="height:100vh">
            <div class="tree-menu"
                 style="background:#fff">
                <ul class="showul"
                    v-for="(menuItem,index) in data"
                    :key="index">
                    <my-tree :model="menuItem"
                             :type="type"
                             :name="name"
                             :show-checkBox="showCheckBox"></my-tree>
                </ul>
            </div>
        </div>
    </transition>
</template>
<script>
import myTree from './treemenu'

import {
    XHeader,
    Tabbar,
    TabbarItem,
    Group,
    Cell,
    TransferDom,
    Popup

} from 'vux'
export default {
    name: 'App',
    data () {
        return {
            theModel: [],
            userId: '',
            tokenId: '',
            projectId: '',
            userInfo: ''
        }
    },
    directives: {
        TransferDom
    },
    components: {
        Tabbar,
        TabbarItem,
        Group,
        Cell,
        XHeader,
        myTree,
        Popup
    },
    watch: {},
    props: {
        data: {
            type: Array,
            default: () => []
        },
        classValue: {
            type: Boolean,
            default: false
        },
        name: {
            type: String,
            default: 'Name'
        },
        type: {
            type: String,
            default: 'company'
        },
        showCheckBox: {
            type: Boolean,
            default: false
        }
    },
    created () {
        this.isTree = true
    },
    methods: {
        selectUser (data) {
        }
    }
}
</script>
<style scoped lang="less">
.newlist {
    background-color: #fff;
}
.fade-enter-active,
.fade-leave-active {
    transition: opacity 5s;
}
.fade-enter,
.fade-leave-to {
    opacity: 0;
}
</style>
